<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"
          name="viewport">
    <title>燃点管理系统 - 主页</title>
    <link rel="shortcut icon" href="${ctxPath}/static/favicon.ico">
    <link href="${ctxPath}/static/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${ctxPath}/static/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="${ctxPath}/static/css/animate.css" rel="stylesheet">
    <link href="${ctxPath}/static/css/style.css?v=4.1.0" rel="stylesheet">
</head>


<body class="fixed-sidebar full-height-layout white-bg skin-0" style="overflow:hidden">
<div id="wrapper">

    <!--左侧导航开始-->
    @include("/common/_tab.html"){}
    <!--左侧导航结束-->

    <!--右侧部分开始-->
    @include("/common/_right.html"){}
    <!--右侧部分结束-->

    <!--右侧边栏开始-->
    @include("/common/_theme.html"){}
    <!--右侧边栏结束-->

</div>

<!-- 全局js -->
<script src="${ctxPath}/static/js/jquery.min.js?v=2.1.4"></script>
<script src="${ctxPath}/static/js/bootstrap.min.js?v=3.3.6"></script>
<script src="${ctxPath}/static/js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="${ctxPath}/static/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<script src="${ctxPath}/static/js/plugins/layer/layer.min.js"></script>

<!-- 自定义js -->
<script src="${ctxPath}/static/js/hplus.js?v=4.1.0"></script>
<script type="text/javascript" src="${ctxPath}/static/js/contabs.js"></script>

<!-- 第三方插件 -->
<script src="${ctxPath}/static/js/plugins/pace/pace.min.js"></script>

<script src="${ctxPath}/static/js/plugins/echarts/echarts-all.js"></script>

</body>

<script>
    var userId = $("#userId").val();

    var websocket = null;
    //判断当前浏览器是否支持WebSocket
    if ('WebSocket' in window) {
        websocket = new WebSocket("ws://localhost:8080/ws/webSocket");

        //websocket = new WebSocket("ws://echo.websocket.org", ["com.kaazing.echo","example.imaginary.protocol"])
    }
    else {
        alert('当前浏览器 Not support websocket')
    }

    //连接发生错误的回调方法
    websocket.onerror = function () {
        setMessageInnerHTML("WebSocket连接发生错误");
    };

    //连接成功建立的回调方法
    websocket.onopen = function () {
        setMessageInnerHTML("WebSocket连接成功");
    }

    //接收到消息的回调方法
    websocket.onmessage = function (event) {
        alert(event.data);
        setMessageInnerHTML(event.data);
    }

    //连接关闭的回调方法
    websocket.onclose = function () {
        setMessageInnerHTML("WebSocket连接关闭");
    }

    //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
    window.onbeforeunload = function () {
        closeWebSocket();
    }

    //将消息显示在网页上
    function setMessageInnerHTML(innerHTML) {
        document.getElementById('message').innerHTML += innerHTML + '<br/>';
    }

    //关闭WebSocket连接
    function closeWebSocket() {
        websocket.close();
    }

    //发送消息
    function send() {
        var message = document.getElementById('text').value;
        websocket.send(message);
    }
</script>

</html>
